<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	template="../pages/template.xhtml">
	<ui:define name="head">
		<title>#{msg.atencionesTitle}</title>
	</ui:define>
	<ui:define name="left"></ui:define>
	<ui:define name="center">
		<h:form prependId="false" styleClass="formPrincipal">
			<p:ajaxStatus style="width:16px;height:16px;">
				<f:facet name="start">
					<h:graphicImage value="../images/loading.gif" />
				</f:facet>
				<f:facet name="complete">
					<h:outputText value="" />
				</f:facet>
			</p:ajaxStatus>
			<p:growl id="msgs" />
			<p:panel header="#{msg.buscar}" id="buscar">
				<h:panelGrid columns="7">
					<h:outputLabel value="#{msg.usuario}:"></h:outputLabel>
					<p:inputText id="usuario"
						value="#{atencionPrimariaBean.cadenaUsuario}">
						<p:ajax event="keyup" update="atenciones,atencionesList"
							listener="#{atencionPrimariaBean.buscar}" />
					</p:inputText>
					<h:outputLabel value="#{msg.tecnico}:"></h:outputLabel>
					<p:inputText id="tecnico"
						value="#{atencionPrimariaBean.cadenaTecnico}">
						<p:ajax event="keyup" update="atenciones,atencionesList"
							listener="#{atencionPrimariaBean.buscar}" />
					</p:inputText>
					<h:outputLabel value="#{msg.departamento}:"></h:outputLabel>
					<h:panelGrid columns="2">
						<p:selectOneMenu value="#{atencionPrimariaBean.departamento}"
							effect="fade">
							<f:selectItem itemLabel="#{msg.seleccioneDepartamento}" itemValue="" />
							<f:selectItems
								value="#{atencionPrimariaBean.nombreDepartamentos}" />
							<p:ajax update="atenciones,atencionesList"
								listener="#{atencionPrimariaBean.buscar}" />
						</p:selectOneMenu>
					</h:panelGrid>
					<p:commandLink value="#{msg.limpiar}"
						action="#{atencionPrimariaBean.limpiar}" update="@form"></p:commandLink>
				</h:panelGrid>
			</p:panel>
			<p:panel header="#{msg.listadoAtenciones}"
				style="margin-top: 10px;" id="atenciones">
				<p:dataTable id="atencionesList" styleClass="table"
					value="#{atencionPrimariaBean.atenciones}" var="atencionVar"
					paginator="true" rows="15" emptyMessage="#{msg.tablaVacia}">
					<p:column headerText="#{msg.fecha}" style="width:125px" sortBy="#{atencionVar.fecha}">
						<h:outputText value="#{atencionVar.fecha}" />
					</p:column>
					<p:column headerText="#{msg.tecnico}" style="width:125px">
						<h:outputText value="#{atencionVar.tecnicoBean.nombre} #{atencionVar.tecnicoBean.apellidos}" />
					</p:column>
					<p:column headerText="#{msg.usuario}" style="width:125px">
						<h:outputText value="#{atencionVar.usuarioBean.nombre} #{atencionVar.usuarioBean.apellidos}" />
					</p:column>
					<p:column headerText="#{msg.descripcion}" style="width:125px">
						<h:outputText value="#{atencionVar.descripcion}" />
					</p:column>
				</p:dataTable>
			</p:panel>
		</h:form>
	</ui:define>
</ui:composition>